
<!-- 列表界面 -->
<div id="data-list">
	<div class="banner">
		<span class="base-blue-01 base-search iconfont icon-chazhaobiaodanliebiao" data-title='部门列表'>部门列表查询</span>
	</div>
	<div class="base-form"> 
		<form id="fa-search">
			<table class="base-table form search">
				<tr>
					<td class="td-bg" width="150">部门名称</td>
					<td class="left padding-l">
						<input	class="base-input" name="name"  id="name">
					</td>
					<td class="td-bg" width="150">创建日期</td>
					<td class="left padding-l">
						<input	class="base-input base-date" name="createTime" id="createTime" onclick="WdatePicker({skin:'whyGreen',dateFmt:'yyyy-MM-dd'})">
					</td>
					<td class="center" rowspan="1" width="150">
						<button id="btn_search" type="button" class="base-btn base-bg-green" data-toggle="modal">查询</button>
					</td>
				</tr>
			</table>
		</form>
	</div>
	<div class="banner">
		<span class="base-blue-01 base-search iconfont icon-chazhaobiaodanliebiao">部门列表</span>
		<shiro:hasPermission name="sysDept:saveDept">
			<div id="toolbar" class="toolbar">
				<button id="btn_add" type="button" class="base-btn base-bg-blue" data-toggle="modal">新增</button>
			</div>
		</shiro:hasPermission>
	</div>
	<div id="list">
	<table class="list-table base-table">
		<thead>
			<tr>
				<th width="60">序号</th>
				<th width="100">部门名称</th>
				<th width="100">上级部门名称</th>
				<th width="80">部门编号</th>
				<th width="80">描述</th>
				<th width="120">创建时间</th>
				<th width="120">修改时间</th>
				<th width="100">部门操作</th>
			</tr>
		</thead>
		<tbody id="datalist">
			
		</tbody>
		<script id="tradecent-template" type="text/x-handlebars-template">
	{{#each this}}
	<tr>
		<td><div class='base-wrap'>{{addOne @index}}</div></td>
		<td><div class='base-wrap left' title='{{name}}'>{{name}}</div></td>
		<td><div class='base-wrap left' title='{{isNull parentDept.name}}'>{{isNull parentDept.name}}</div></td>
		<td><div class='base-wrap left'>{{deptCode}}</div></td>
		<td><div class='base-wrap left'>{{remark}}</div></td>
		<td><div class='base-wrap'>{{createTime}}</div></td>
		<td><div class='base-wrap'>{{updateTime}}</div></td>		
		<td>
		<shiro:hasPermission name="sysDept:saveDept"><span class="oper-handle iconfont icon-bianji base-yellow update" title='修改部门' data-pkid={{deptId}}></span></shiro:hasPermission>
		<shiro:hasPermission name="sysDept:deleteDept"><span class="oper-handle iconfont icon-shanchu base-red delete" title='删除部门' data-pkid={{deptId}}></span></shiro:hasPermission>
		<shiro:hasPermission name="sysDept:detailDept"><span class="oper-handle iconfont icon-xiangqing base-blue detail" title='详情部门' data-pkid={{deptId}}></span></shiro:hasPermission>
		</td>
	</tr>
	{{/each}}		
	</script>
	</table>
	</div>
</div>
<!-- end列表界面 -->

<!-- 新增与详情页面 -->
<div id="data-form" data-title='部门新增'>
	<form id="form">
		<table class="base-table form">
			<input type='hidden' name='deptId'>
			<tr>
				<td class="td-bg" width="100">上级部门</td>
				<td class="left">
					<select class="base-select base-select-fa"  name="parentDeptIds" id="deptIds" data-id="deptId">
					<option value="">请选择
					</option>
					</select>
				</td>
			</tr>
			<tr>
				<td class="td-bg" width="100">部门名称</td>
				<td class="left"><input name="name"
					class="base-input validate require" data-exp="w{2-20}"></td>
			</tr>
			<tr>
				<td class="td-bg" width="100">部门编码</td>
				<td class="left">
				    <input name="deptCode"  id="deptCode"
				    class="base-input validate require" data-exp="w{2-15}">
				</td>
			</tr>
			<tr>
				
				<td width="150">部门描述</td>
				<td colspan="1">
					<textarea rows="" cols="" class="base-textarea" name="remark"></textarea> 
				</td>
			</tr>
		</table>
	</form>
	<div id="toolbar" class="toolbar buttom-btn fixed_pos">
			<button id="btn_back" type="button" class="base-btn base-bg-yellow">
				返回</button>
			<button id="btn_save" type="button" class="base-btn base-bg-blue ">
				保存</button>
		</div>
</div>
<!--end新增与详情页面-->
<script type="text/javascript">
	$(function() {
		getDept();
		$.baseEvent({
			ctx:'',
			param:['name','createTime'],
			isPage:true,
			pageList_url:"/sysDept/pageList",
			form_url:'/sysDept/saveDept',
			data_list:'/route/sys/sys_deptList',
			del_url:'/sysDept/delDept',
			findBy_url:'/sysDept/findDept',
			add_is_dialog:true
		});
		
		//防止选择重复部门
		$("#deptIds").on('change',function(){
			
			var deptId = $("input[name='deptId']").val();
			var selectedVal = $(this).val();
			if(selectedVal && selectedVal==deptId){
				$(this).val("");
				layer.tips('上级部门和本级部门不能一样', '#deptIds');
			}
		});
		
		//部门编号重复校验
		$("#deptCode").on('change',function(){
			var $_this = $(this);
			var v_deptCode = $_this.val();
			if(v_deptCode){
				$._NormalRequest({
					url : "/sysDept/findDeptCode",
                    type:'get',
					para:{deptCode:v_deptCode},
					callback : function(res) {
						if(res.code==='1'){
							layer.tips('此部门编码已存在', $_this);
							$_this.val("");
						}
					}
				});
			}
		});
	});
	
	//查找部门
	function getDept() {
		var my = {
				url : "/sysDept/findTopList",
            	type:'get',
				callback : function(res) {
					for (var i = 0; i < res.data.length; i++) {
						$("#deptIds").append(
								"<option value='"+res.data[i].deptId+"'>"
								      + res.data[i].name + "</option>");
					}
				}
		}
		$._NormalRequest(my);
	}
	
</script>
